import React, { Component } from 'react';
import { Input, Button, message } from 'antd';
import { Redirect } from 'react-router-dom';
import draftJs from 'draftjs-to-html';
import Editor from '../../components/Editor';
import './index.scss';

class ArticleEdit extends Component {

  // 设置应用创建时的初始状态
  state = {
    title: '',
    content: ''
    // id: this.props.match.params.id
  }

  handleTitleChange = (e) => {
    this.setState({
      title: e.target.value
    });
  }

  onEditorChange = (contentState) => {
    this.setState({
      content: contentState
    });
  }

  submitArticle = () => {
    message.success('文章发布成功!');
    console.log(draftJs(this.state.content));
  }

  render() {
    const loginStatus = true;
    if(loginStatus) {
      return (
        <div className='article-edit'>
          <div className='article-edit-title'>
            <Input placeholder='文章标题' value={this.state.title} onChange={this.handleTitleChange} />
          </div>
          <Editor
            content={this.state.content}
            onEditorChange={this.onEditorChange}
          />
          <div>
            <Button type='primary' onClick={this.submitArticle}>提交</Button>
          </div>
        </div>
      );
    } else {
      return <Redirect to='/login' />
    }
  }
}

export default ArticleEdit;